﻿body {
    min-height: 1000px;
    min-width: 1000px;
    background-color: #E2DBC0;
}

.synxhover {
    border-color: #ff7f50 !important;
}


#chatmessages {
    clear: both;
    list-style: none;
}

#inputBar {
    float: right;
    height: 40px;
    position: absolute;
    bottom: 10px;
    display: table;
    width: 90%;
}

#messageContainer {
    height: 400px;
    overflow-y: scroll;
}

#message {
    width: 100%;
}

#buttonSpan {
    display: table-cell;
}

#send {
    display: table-cell;
    width: 90px;
    white-space: nowrap;
    float: right;
    position: relative;
    top: 6px;
}

#renderbody {
    width: 400px;
    margin-left: auto;
    margin-right: auto;
}

fieldset {
    background: #ffffff;
    background: rgba(255, 255, 255, 0.6);
    border-color: white;
    border-width: 1px;
    width: 390px;
    border-style: solid;
}

h1, h2 {
    text-align: center;
    width: auto;
}

h1 {
    display: inline;
    position: relative;
    font: normal 170px/100% Verdana, Tahoma, sans-serif;
    letter-spacing: -5px;
    color: rgba(0,0,255,0.5);
}

h2 {
    font: normal 18px/100% Verdana, Tahoma, sans-serif;
}

h1:after {
    content: "§ynx";
    position: absolute;
    left: 10px;
    top: 5px;
    color: rgba(0,255,0,0.5);
}

fieldset legend {
    padding-top: 8px;
    width: 200px;
    height: 25px;
    text-align: center;
    border-width: 1px;
    border-style: solid;
    border-color: #C9C9C9;
    /* SVG fallback(Opera 11.10-, IE9) */
    background: url();
    /* Opera 11.10+ */
    background: -o-linear-gradient(top, rgba(255,204,112,1), rgba(255,255,255,1));
    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, rgba(255,204,112,1), rgba(255,255,255,1));
    /* Chrome 7+ & Safari 5.03+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255,204,112,1)), color-stop(1, rgba(255,255,255,1)));
    /* IE5.5 - IE7 */
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFCC70,EndColorStr=#FFFFFFFF);
    /* IE8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFCC70,EndColorStr=#FFFFFFFF)" -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: solid 1px #E5E5E5;
    font: normal 13px/100% Verdana, Tahoma, sans-serif;
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
}

fieldset label, fieldset legend {
    font-variant: small-caps;
    font: normal 13px/100% Verdana, Tahoma, sans-serif;
}

fieldset ul, fieldset li {
    padding: 3px;
    list-style: none;
}

fieldset li {
    list-style: none;
    clear: both;
    padding-bottom: 35px;
    font: normal 13px/100% Verdana, Tahoma, sans-serif;
}

fieldset input, fieldset span {
    float: left;
}

fieldset input {
    padding-left: 10px;
    z-index: 100;
}

fieldset label {
    width: 120px;
    float: left;
    text-align: right;
    margin-right: 10px;
    height: 20px;
}

    fieldset label.inputLabel {
        color: #555;
        padding-top: 5px;
        padding-right: 10px;
        height: 22px;
        position: relative;
        left: 15px;
        border-width: 1px;
        border-style: solid;
        border-color: #C9C9C9;
        /* SVG fallback(Opera 11.10-, IE9) */
        background: url();
        /* Opera 11.10+ */
        background: -o-linear-gradient(top, rgba(255,255,240,1), rgba(112,128,144,1));
        /* Firefox 3.6+ */
        background: -moz-linear-gradient(top, rgba(255,255,240,1), rgba(112,128,144,1));
        /* Chrome 7+ & Safari 5.03+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255,255,240,1)), color-stop(1, rgba(112,128,144,1)));
        /* IE5.5 - IE7 */
        filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFFFF0,EndColorStr=#FF708090);
        /* IE8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFFFF0,EndColorStr=#FF708090)";
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
        -moz-border-radius-bottomleft: 5px;
        -moz-border-radius-topleft: 5px;
        border: solid 1px #E5E5E5;
        font: normal 13px/100% Verdana, Tahoma, sans-serif;
        box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
        -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
        -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    }


input:hover, textarea:hover,
input:focus, textarea:focus {
    border-color: #C9C9C9;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
    -moz-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
}

input, textarea {
    height: 25px;
    border: solid 1px #E5E5E5;
    font: normal 13px/100% Verdana, Tahoma, sans-serif;
    width: 200px;
    background: #FFFFFF;
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    background: url();
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
    background: -o-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
